<template>
  <div class="qqlogin">
    <Spin fix>
      <Icon type="ios-loading" size=18 class="demo-spin-icon-load"></Icon>
      <div>正在登陆中……</div>
    </Spin>
  </div>
</template>

<script setup lang="ts">
import {onMounted, ref} from "vue";
import {qqLogin} from "@/api";
import {Message, Spin} from "view-ui-plus"
import {useStore} from "vuex";
import {useRouter} from "vue-router";

declare const QC;

const store = useStore();
const router = useRouter();

const qqInit = () => {
  QC.Login.getMe((openid, access_token) => {
    // 同步QQ的信息
    console.log(openid, access_token, 'openid, access_token')
    qqLogin({
      openid,
      access_token
    }).then((result: any) => {
      console.log(result, 'QQ注册与登录')
      if (result.code == 200) {
        Message.success(result.message)
        store.dispatch('UpdateLoginStatus', {
          Token: result.data.token,
          UserData: result.data.userInfo
        })
        setTimeout(() => {
          router.replace('/');
        }, 800)
      } else {
        Message.error(result.message)
      }
    })
  })
}

onMounted(() => {
  qqInit()
})
</script>

<style>
.qqlogin {
  height: 100vh;
}

.qqlogin > div {
  height: 100%;
}
</style>
